#{extends 'main.html' /}
#{script 'bootstrap-modal.js'/}
#{script 'bootstrap-dropdown.js'/}
#{set high: '850' /}
#{set myFollowings : usr.getFollowing()/}
 
<script>
    $(function(){
        $("body").css("background","url(${usr.background})");

        //获取新微博
        $(function(){
            var getNewMBlogs = function(){
                $("<div style=\"display: none\"></div>").load("@{Application.getNewMBlogs}", function(){
                    $("#allpost").prepend($(this));
                    $(this).slideDown(1000);                   
                    getNewMBlogs();
                });
            };
          if(document.cookie.length>122){
          	 
                    getNewMBlogs();
                  }
             
        });
       //转发微博 
        var originPostId = 0;
        $("a[data-toggle='modal']").live('click',function(){
            originPostId = $(this).attr("data-postid");
        });
        $(".modal-footer .btn-primary").click(function(){    
            var url = "/application/publish"
            var content = $(".modal-body textarea").val();
            url = url+"?content="+content+"&originPostId="+originPostId;
            //alert(url);
            $.get(url);
            $("#modalbackdroptrue").modal("hide");
        });
        
        //发表评论按钮动作
        $(".accordion-body input[type='button']").live('click',function(e){
            e.preventDefault();
            var a  =   $(this).attr("data-postid");
            var b = $(this).attr("data-authorid");
            var d = new Date();
            var date=d.getHours()+":"+d.getMinutes()+":"+d.getSeconds();
            
            var pCnt = $("#comText"+a).attr("data-postComCnt");
            pCnt = parseInt(pCnt)+1
            $("#comText"+a).attr("data-postComCnt",pCnt);
            var cText = $("#comText"+a).text("评论("+pCnt+")");
            
            var  f = #{jsAction @Application.makeComment(':postid',':content') /}; 
            var content = $(this).prev().val();
            var s=  f({content:content,postid:a,authorid:b});
            $.get(s);
            $newDiv = $("<div style=\"display: none\"><img style=\"width: 32px;height: 32px\" src=\"${usr.avatar}\">${usr.name}:"+content+"("+date+")<a  style=\" float: right\" href=\"#\" class=\"cdel\">删除</a><hr></div>");
            //$newDiv.text("");
            $("#com"+a).prepend($newDiv);
            $newDiv.slideDown(1000);
            //alert("11111111");           
        });
        //展开收缩加载评论列表
        $(".accordion-toggle").live('click',function(e){
            e.preventDefault();
            //alert("asdasdas");
            var loaded = $(this).attr("data-loaded");
            if(loaded==0){
            var  s = #{jsAction @Application.getComment(':postId') /}; 
            var postId = $(this).attr("data-postid");
            $newDiv = $("<div></div>");
            var url = s({postId:postId});
            $newDiv.load(url);
            $newDiv.appendTo($("#com"+postId));
            $(this).attr("data-loaded","1");
            }
        });
        $("img.postImg").live('click',function(e){
            //var imgid  =   $(this).attr("data-postid");
            //alert($(this).css("height"));
            if($(this).css("height")=="100px"){
                $(this).css("height","auto");
            }
            else {$(this).css("height","100px");}
        });
        
        function toggle(targetName){
            if (document.getElementByName){
                target=document.getElementByName(targetNanme);
                if (target.style.display=="block"){
                    target.style.display="none";
                } else {
                    target.style.display="block";
                }
            }
        }
        //删除微博
        $("a.del").live('click',function(e){
            e.preventDefault(); 
            var uid = $(this).attr("data-mypostsid");
            $("#div"+uid).slideToggle(1000);
            var cnt = $("#postCnt").text();
            cnt = parseInt(cnt)-1
            var cnt = $("#postCnt").text(cnt);            
        });
        
        //删除评论
        $("a.cdel").live('click',function(e){
            e.preventDefault(); 
            var cid = $(this).attr("data-comLid");
            var pid = $(this).attr("data-postid");
            var pCnt = $("#comText"+pid).attr("data-postComCnt")-1;
            $("#comText"+pid).attr("data-postComCnt",pCnt);
            $("#comL"+cid).slideToggle(1000);
            var cText = $("#comText"+pid).text("评论("+pCnt+")"); 
        });
        
        //加关注
        $("a.follow").live('click',function(e){
            e.preventDefault();
            var uid = $(this).attr("data-uid");
            var follow = #{jsAction @Application.follow(':uid') /};               
            $.get(follow({uid:uid})) 
            $(this).text("取消")
            $(this).removeClass("follow");
            $(this).addClass("unfollow");
            $(this).removeClass("badge-info");
            $(this).addClass("badge-error");      
            var cnt = $("#followingCnt").text();
            cnt = parseInt(cnt)+1
            var cnt = $("#followingCnt").text(cnt);
        });
        //取消关注
        $("a.unfollow").live('click',function(e){
            e.preventDefault(); 
            var uid = $(this).attr("data-uid");
            var unfollow = #{jsAction @Application.unfollow(':uid') /};               
            $.get(unfollow({uid:uid})) 
            $(this).text("关注")
            $(this).removeClass("unfollow");
            $(this).addClass("follow");
            $(this).removeClass("badge-error");
            $(this).addClass("badge-info");          
            var cnt = $("#followingCnt").text();
            cnt = cnt-1
            var cnt = $("#followingCnt").text(cnt);
        });
        $('.dropdown-toggle').dropdown();
    });



    $(function(){
        var i=0;
        //聊天消息闪烁提醒
        function flicker(e){
            title_default = $("title").text() ;
            if(i==0) {
                $("title").text("来自"+e+"的聊天消息");
                i = 1 ;
            } 
            else {
                $("title").text("提醒");
                i = 0 ;
            }
            //$("title").text(title_default+"111");
            $("#a"+e).fadeTo(500,0.25).fadeTo(500,1);
        }

        var lastReceived = 0;
        var getChatNotify = #{jsAction @Chat.getChatNotify(':lastReceived') /};
        var longPolling = function(){ 
            $.get(getChatNotify({lastReceived:lastReceived})).done(function(data){
                $(data).each(function(i,e){
                    setInterval(function(){flicker(e.data.senderName)},1000);
                    
                });
                longPolling();
            });
        }; 
        longPolling();
    });

    $(function(){
        //获取总提醒数
        var  getTotal = function(){
            var newFansCnt = parseInt($("#newFansCnt").text());
            var atMeCnt = parseInt($("#atMeCnt").text());
            var newCommentCnt = parseInt($("#newCommentCnt").text());
            $("#noteCnt").text( newFansCnt + atMeCnt + newCommentCnt );
        };
        //获取新粉丝提醒
        var f = function(){
            $.get("@{Application.getNewFans}").done(function(data){
                var newFansCnt = parseInt($("#newFansCnt").text());
                $("#newFansCnt").text(data.length + newFansCnt);
                getTotal();
                $(".dropdown-menu").show();
                f();
                
            });
        };    

        //获取@到提醒
        var longPolling = function(){
            $.get("@{Application.getAtMe}").done(function(data){
                var atMeCnt = parseInt( $("#atMeCnt").text());
                $("#atMeCnt").text(data.length + atMeCnt);
                getTotal();             
                $(".dropdown-menu").show();
                longPolling();
            });
        };
        //获取评论提醒
        var getComment = function(){
                $.get("@{Application.getCommentNotice}").done(function(data){
                    var newCommentCnt = parseInt( $("#newCommentCnt").text());
                    $("#newCommentCnt").text(data.length + newCommentCnt);
                    getTotal();
                    $(".dropdown-menu").show();
                    getComment();
                });  
        };
     
        if(document.cookie.length>122){
            getComment();
            longPolling();
            f();
        }
     
        $(".dropdown-toggle").click(function(){
                $(".dropdown-menu").toggle();
        });
      /*  $(document).mousedown(function(){
                $(".dropdown-menu").hide();
        });*/
        
      
    
    });


</script>
 
<!-- 顶部导航栏 -->
<div class="navbar navbar-fixed-top">
    <div class="navbar-inner">
        <div class="container">
            <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </a>
            <a class="brand" href="#">SZWB</a>
            <div class="nav-collapse">
                <ul class="nav pull-right">
                    <li class="#{get 'index'/}"> <a href="/" >首页</a></li> 
                    <li class="#{get 'user' /}"> <a href="@{Application.myposts}">#{get 'user_name'/}</a></li> 
                    <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropddown">提醒（<span id="noteCnt">0</span>）<b class="caret"></b></a> 
                        <ul class="dropdown-menu">
                            <li><a href="@{Application.followers}">新粉丝 <span id="newFansCnt" style="float:right">0</span> </a></li>
                            <li><a href="@{Application.myat}">@到我  <span id="atMeCnt" style="float:right">0</span></a></li>
                            <li><a href="@{Application.comment}">新评论  <span id="newCommentCnt" style="float:right">0</span></a></li>
                        </ul>
                    </li> 
                    <li class="#{get 'logout'/}"> <a href="@{Application.logout}">退出</a></li> 
                </ul>
            </div>
        </div>
    </div>
</div>

<!-- 页面主体 -->
<div class="container" style="background: white; height: auto" > 
    <div class="row" > 
        <!-- 左侧导航栏 -->
        <div style="background: #bbdff2; height: 670px" class="span2" >
            <a href="@{Application.myposts}">
                <img src="#{get 'user_img'/}" style="width: 150px;height: 150px" alt="">
            </a>
            <a href="@{Application.myposts}" style="position: relative; left:50%;" >#{get 'user_name'/}</a> 
            <table style="position: relative; left:20px;">
                <tbody>
                    <tr>
                        <th id="followingCnt">#{get 'user_following_cnt'/}</th>
                        <th id="followersCnt">#{get 'user_followers_cnt'/}</th>
                        <th id="postCnt">#{get 'user_post_cnt'/}</th>
                    </tr>
                    <tr>
                        <td><a href="@{Application.followings}">关注</a>|</td>
                        <td><a href="@{Application.followers}">粉丝</a> |</td>
                        <td><a href="@{Application.myposts}">微博</a></td>
                    </tr>
                </tbody>
            </table>
            <hr>

            <ul class="nav nav-pills nav-stacked">
                <li class="#{get 'index'/}">
                    <a href="/">首页</a>
                </li>
                <li class="#{get 'comment'/}">
                    <a href="@{Application.comment}">评论</a> 
                </li>
                <li class="#{get 'myat'/}">
                    <a href="@{Application.myat}">@到我的</a> 
                </li>
                <li class="#{get 'photo'/}">
                    <a href="@{UserInfoSet.photo}">修改头像</a> 
                </li>
                <li class="#{get 'userIn'/}">
                    <a href="@{UserInfoSet.index}">修改个人信息</a> 
                </li>
                <li class="#{get 'backdround'/}">
                    <a href="@{UserInfoSet.background}">个性设置</a> 
                </li>
            </ul>
        </div>

        <!-- 主体内容 -->
        <div class="span7" style="background: white; height: auto">
            #{doLayout /}
        </div>

        <!-- 右侧用户列表 -->
        <div class="span3" style="background: #fcf7ea ;height: 670px" >
             #{if usr.weiboToken==null}
             <a style="margin: auto" href="@{Application.syncRequest}"><img src="/public/images/sina.png" style="position:relative;top:-3px;"/>&nbsp;与新浪微博同步</a>
            #{/if}
            #{else}
            <a style="margin: auto" href="@{Application.syncCancel}"><img src="/public/images/sina.png" style="position:relative;top:-3px;"/>&nbsp;取消同步</a>
            #{/else}
            <hr>
            <ul class="thumbnails nav-stacked" style=" position: relative;left: 5px;top:0px">
                #{list items: models.User.findAll() , as:'usr'}
                <li class="span1">
                    ${usr.name}
                    <img src="${usr.avatar}" style="width: 50px;height: 50px" >
                    <a id="a${usr.name}" class="badge badge-info" target="_blank" href="@{Chat.index(usr.id)}" rel="tooltip" title="与TA私聊">聊天 </a>
                    #{if !myFollowings.contains(usr)}  
                    <a class="badge badge-info follow" data-uid="${usr.id}" href="" rel="tooltip" title="关注TA">关注</a>  
                    #{/if}  
                    #{else}  
                    <a class="badge badge-error unfollow"  data-uid="${usr.id}" href="" rel="tooltip" title="取消关注">取消</a>    
                    #{/else} 
                </li>
                #{/list}
            </ul>
        </div>
    </div>     
    <footer class="footer">
        <span style="float:right">Made by HS10-510</span>
    </footer>
</div>

>
